<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Insert title here</title>
    <link rel="stylesheet" href="/apply/css/pintuer.css">
    <link rel="stylesheet" href="/apply/css/admin.css">
    <script type="text/javascript" src="/apply/js/jquery-3.5.1.js"></script>
    <script type="text/javascript" src="/apply/laydate/laydate.js" ></script>

</head>
<body>
<div class="panel admin-panel" id="app">
    <div class="panel-head" id="add">
        <strong><span class="icon-pencil-square-o"></span>人事申请表</strong>
    </div>

    <div class="body-content">
        <form id="form" class="form-x">

            <div class="form-group">
                <div class="label">
                    <label>申请类别：</label>
                </div>
                <select class="input" id="applyType"
                        style="width: 200px; line-height: 17px;">
                    <option value=0>全部</option>
                    <option value=1>外出</option>
                    <option value=2>事假</option>
                    <option value=3>病假</option>
                    <option value=4>出差</option>
                </select>
            </div>
            <div class="form-group">
                <div class="label">
                    <label>备注：</label>
                </div>
                <div class="field">
                    <input type="text" class="input w50" value=""  id="applyRemark"/>
                </div>
            </div>

            <div class="form-group">
                <div class="label">
                    <label>开始时间：</label>
                </div>
                <div class="field">
                    <input type="text" class="input w50" value=""  id="startTime"/>
                </div>
            </div>
            <div class="form-group">
                <div class="label">
                    <label>结束时间：</label>
                </div>
                <div class="field">
                    <input type="text" class="input w50" value=""  id="endTime"/>
                </div>
            </div>


           <br><br> <div class="form-group">
                <div class="label">
                    <label></label>
                </div>
                <div class="field">
                    <button class="button bg-main icon-check-square-o" type="button" onclick="insertAccount()">
                        提交
                    </button>

                </div>
            </div>

        </form>
    </div>
</div>
</body>

<script type="text/javascript">

       laydate.render({
       elem: '#startTime', //指定元素
       type: 'datetime'
   });
   laydate.render({
       elem: '#endTime', //指定元素
       type: 'datetime'
   })
       var date1 = new Date();
       var date2 = new Date();
       function insertAccount() {

           var data = {
               applyType: $("#applyType").val(),
               applyRemark: $("#applyRemark").val(),
               applyStartTime: new Date($("#startTime").val()),
               applyEndTime: new Date($("#endTime").val()),
           };

           date1 = date2;
           date2 = new Date();
           if ((date2.getTime() - date1.getTime()) < 5000) {
               alert("请不要重复提交")
           } else {

               $.ajax({
                   url: "/apply/apply/insert",
                   type: "post",
                   data: data,
                   dataType: "json",

                   success: function (data) {
                       location.reload();
                    alert("申请成功");


                   },
                   error: function (error) {
                       alert("申请失败");
                   }
               })
           }
       };
</script>
</html>